<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        var elementsByName = document.getElementsByName("sport")
        //全选
        function selectAll(){

            for (var i = 0; i < elementsByName.length; i++) {
                elementsByName[i].checked=true
            }
        }

        //全不选
        function selectNone(){

            for (var i = 0; i < elementsByName.length; i++) {
                elementsByName[i].checked=false
            }
        }

        //反选
        function selectReverse(){

            for (var i = 0; i < elementsByName.length; i++) {
                elementsByName[i].checked=!elementsByName[i].checked
            }
        }
    </script>
</head>
<body>
<input type="checkbox" name="sport" value="zq">足球
<input type="checkbox" name="sport" value="tq">台球
<input type="checkbox" name="sport" value="ppq">乒乓球<br>
<button onclick="selectAll()">全选</button>
<button onclick="selectNone()">全不选</button>
<button onclick="selectReverse()">反选</button>
</body>
</html>